// import React from 'react'
import { Routes, Route } from 'react-router-dom'
import { Suspense,lazy } from 'react'
// import './App.css'
// 引入页面
import Main from './pages/main'
import Home from './pages/main/home'
// import Detail from './pages/main/home/detail'
// import Detail1 from './pages/main/home/detail1'
import Cart from './pages/main/cart'
import Order from './pages/main/order'
import Mine from './pages/main/mine'
import Login from './pages/login'
import Register from './pages/login/register'
import Detail2 from './pages/main/home/detail2'


function App() {

  // 模拟异步加载
  // const delayImport =(path:string)=>{
  //   return new Promise(resolve=>{
  //     setTimeout(()=>{
  //       const Component = import(path) //引入组件
  //       resolve(Component)  //返回组件
  //     },3000)  //延迟三秒
  //   })
  // }


  // 异步引入
  const withLazy=(path:string)=>{
    // 因为要异步导入，所以一定要Suspense
    //lazy的回调函数的返回值就是异步组件
    const Component = lazy(()=>import(path))//可以使用delayImport模拟延时加载
    return(
      <Suspense fallback={<div>加载中...</div>}>
        <Component></Component>
      </Suspense>
    )
  }





  return (
    <>
      {/* <h1>还有一个星期就毕业了</h1>
     <div>但是我们找不到工作</div> */}

      <Routes>
        <Route path='/login' element={<Login></Login>}></Route>
        <Route path='/register' element={<Register></Register>}></Route>
        <Route path='/' element={<Main></Main>}>
          <Route path='/home' element={<Home></Home>}></Route>
          {/* <Route path='/detail' element={<Detail></Detail>}></Route> */}
          <Route path="/detail" element={withLazy('./pages/main/home/detail')}></Route>
          <Route path='/detail1/:name/:age' element={withLazy('./pages/main/home/detail1')}></Route>
          <Route path='/detail2' element={<Detail2></Detail2>}></Route>
          <Route path='/cart' element={<Cart></Cart>}></Route>
          <Route path='/order' element={<Order></Order>}></Route>
          <Route path='/mine' element={<Mine></Mine>}></Route>
        </Route>
      </Routes>
    </>
  )
}

export default App
